<template>
  <view class="container">
    <view class="header">
      <text class="title">全部评价({{total}})</text>
      <text class="add-eval-btn" @click="inputDialogToggle">添加评价</text>
    </view>
    <view class="eval-list">
      <view class="eval-item" v-for="(item, index) in listData" :key="item.id || index">
        <view class="eval-content">{{ item.evaluate }}</view>
        <view class="eval-time">{{ item.createTime }}</view>
      </view>
    </view>

    <u-popup ref="inputDialog" mode="center" :overlay="true" :close-on-click-overlay="true">
      <view class="popup-content">
        <view class="popup-header">
          <text class="popup-title">评价房源</text>
          <u-icon name="close" size="24" @click="closePopup"></u-icon>
        </view>
        <view class="popup-body">
          <textarea
              class="eval-textarea"
              placeholder="请输入评价"
              v-model="ownevalu"
              :maxlength="300"
              auto-height
          ></textarea>
          <view class="char-count">{{ ownevalu.length }}/300</view>
        </view>
        <view class="popup-footer">
          <button class="cancel-btn" @click="closePopup">取消</button>
          <button class="confirm-btn" @click="submitEval">提交</button>
        </view>
      </view>
    </u-popup>
  </view>
</template>

<script>
import storage from "@/utils/storage.js";
import {saveHouseEvals,selectHouseEvals} from "@/api/house"
export default {
  data() {
    return {
      houseId: null,
      buildId:null,
      listData: [],
      pageNum: 1,
      pageSize: 20,
      scrollTop: 0,
      loadStatus: 'loadmore',
      total: 0,
      ownevalu: '',
      userId: null,
      isLoading: false,
      hasAuth: false
    };
  },
  onLoad(option) {
    console.log(option.houseId);
    console.log(option.buildId);
    if(undefined!=option.houseId){
      this.houseId = option.houseId;
    }

    if(undefined!=option.buildId){

      this.buildId = option.buildId;
    }


    this.initPage();
  },
  onPageScroll(e) {
    this.scrollTop = e.scrollTop;
  },
  onReachBottom() {
    if (this.loadStatus === 'nomore' || this.isLoading) return;
    this.loadStatus = 'loading';
    this.getList();
  },
  onPullDownRefresh() {
    this.pageNum = 1;
    this.getList(() => {
      uni.stopPullDownRefresh();
    });
  },
  methods: {
    async initPage() {
    //  await this.checkAuth();
      this.getList();
    },
    // async checkAuth() {
    //   const userInfo = storage.getUserInfo();
    //   if (!userInfo) {
    //     uni.showToast({
    //       title: '请先登录',
    //       icon: 'none'
    //     });
    //     return uni.navigateTo({ url: '../login/login' });
    //   }
    //
    //   this.userId = userInfo.id;
    //
    //   try {
    //     const result = await this.$u.get("api/houseApi/checkAuthEvals", {
    //       houseId: this.houseId,
    //       userId: this.userId
    //     });
    //
    //     this.hasAuth = result.code === 200 && result.data && result.data.length > 0;
    //   } catch (error) {
    //     this.hasAuth = false;
    //     console.error('检查评价权限失败', error);
    //   }
    // },
    async getList(callback) {
      if (this.isLoading) return;

      this.isLoading = true;

      this.selectHouseEvals();
      // try {
      //
      //   const result = await this.$u.get("/api/houseApi/selectHouseEvals", {
      //     houseId: this.houseId,
      //     pageNum: this.pageNum,
      //     pageSize: this.pageSize
      //   });
      //
      //   const data = result.rows || [];
      //   this.total = result.total || 0;
      //
      //   if (this.pageNum === 1) {
      //     this.listData = data;
      //   } else {
      //     this.listData = [...this.listData, ...data];
      //   }
      //
      //   if (data.length < this.pageSize) {
      //     this.loadStatus = 'nomore';
      //   } else {
      //     this.pageNum++;
      //     this.loadStatus = 'loadmore';
      //   }
      //
      //   callback && callback();
      // } catch (error) {
      //   console.error('获取评价列表失败', error);
      //   uni.showToast({
      //     title: '获取评价列表失败',
      //     icon: 'none'
      //   });
      // } finally {
      //   this.isLoading = false;
      // }
    },
    inputDialogToggle() {
      // if (!this.hasAuth) {
      //   return uni.showToast({
      //     title: "只有租客才能进行评论！",
      //     icon: 'none'
      //   });
      // }

      this.ownevalu = '';
      this.$refs.inputDialog.open();
    },
    closePopup() {
      this.$refs.inputDialog.close();
    },
    selectHouseEvals(){
      var params = {};
      if(undefined!=this.houseId){

        params = {
          houseId: this.houseId,
          pageNum: this.pageNum,
          pageSize: this.pageSize
        }
      }else {

        params = {
          buildId: this.buildId,
          pageNum: this.pageNum,
          pageSize: this.pageSize
        }
      }

      selectHouseEvals(params).then((result) => {

        const data = result.data.rows || [];
        this.total = result.data.total || 0;

        if (this.pageNum === 1) {
          this.listData = data;
        } else {
          this.listData = [...this.listData, ...data];
        }

        if (data.length < this.pageSize) {
          this.loadStatus = 'nomore';
        } else {
          this.pageNum++;
          this.loadStatus = 'loadmore';
        }

      });

    },
    saveHouseEvals(){
      var params = {};
      if(undefined!=this.houseId){

        params = {
          evalu: this.ownevalu,
          houseId: this.houseId,
          userId: storage.getUserInfo().id,
          evalUser:storage.getUserInfo().nickName
        }
      }else {
        params = {
          evalu: this.ownevalu,
          buildId: this.buildId,
          userId: storage.getUserInfo().id,
          evalUser:storage.getUserInfo().nickName
        }
      }
      saveHouseEvals(params).then((result) => {

        if(result.data.code==200){
          uni.showToast({
            title: '评价成功',
            icon: 'success'
          });

          this.closePopup();
          this.pageNum = 1;
          this.selectHouseEvals();
        }

      });
    },
    async submitEval() {
      if (!this.ownevalu.trim()) {
        return uni.showToast({
          title: '评价内容不能为空',
          icon: 'none'
        });
      }
this.saveHouseEvals();
      // try {
      //
      //
      //
      //   await this.$u.get("api/houseApi/saveHouseEvals", {
      //     houseId: this.houseId,
      //     evalu: this.ownevalu,
      //     userId: this.userId
      //   });
      //
      //   uni.showToast({
      //     title: '评价成功',
      //     icon: 'success'
      //   });
      //
      //   this.closePopup();
      //   this.pageNum = 1;
      //   this.getList();
      // } catch (error) {
      //   console.error('提交评价失败', error);
      //   uni.showToast({
      //     title: '提交评价失败，请稍后再试',
      //     icon: 'none'
      //   });
      // }
    }
  }
};
</script>

<style lang="scss">
.container {
  background-color: #f5f5f5;
  min-height: 100vh;
}

.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 20rpx;
  height: 80rpx;
  background-color: #fff;
  border-bottom: 1rpx solid #eee;

  .title {
    font-size: 15px;
  }

  .add-eval-btn {
    font-weight: bold;
    color: #2979ff;
  }
}

.eval-list {
  padding: 0 20rpx;
  background-color: #fff;
}

.eval-item {
  padding: 15rpx 0;
  border-bottom: 1rpx solid #eee;

  &:last-child {
    border-bottom: none;
  }

  .eval-content {
    font-size: 15px;
    line-height: 1.5;
  }

  .eval-time {
    margin-top: 10rpx;
    text-align: right;
    color: #909399;
    font-size: 13px;
  }
}

.popup-content {
  width: 650rpx;
  background-color: #fff;
  border-radius: 16rpx;
  overflow: hidden;

  .popup-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20rpx 30rpx;
    border-bottom: 1rpx solid #eee;

    .popup-title {
      font-size: 17px;
      font-weight: bold;
    }
  }

  .popup-body {
    padding: 30rpx;

    .eval-textarea {
      width: 100%;
      min-height: 200rpx;
      padding: 15rpx;
      border: 1rpx solid #eee;
      border-radius: 8rpx;
      font-size: 15px;
    }

    .char-count {
      margin-top: 10rpx;
      text-align: right;
      color: #909399;
      font-size: 13px;
    }
  }

  .popup-footer {
    display: flex;
    padding: 20rpx 30rpx;

    button {
      flex: 1;
      height: 80rpx;
      line-height: 80rpx;
      text-align: center;
      border-radius: 8rpx;
      font-size: 16px;
    }

    .cancel-btn {
      margin-right: 20rpx;
      background-color: #f5f5f5;
      color: #333;
    }

    .confirm-btn {
      background-color: #2979ff;
      color: #fff;
    }
  }
}
</style>